<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    {{template  "link/sell/link.html" .}}
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<div>
    <ul class="layui-nav">
        <li class="layui-nav-item"><a href="">店铺:{{.Store.StoresName}}</a></li>
        <li class="layui-nav-item"><a href="/sell/index">店铺主页</a></li>
        <li class="layui-nav-item"><a href="/sell/orderList">订单</a></li>
        <li class="layui-nav-item"><a href="/sell/store/manage">店铺管理</a></li>
        <li class="layui-nav-item"><a href="/sell/goodManage">商品管理</a></li>
        <li class="layui-nav-item"><a href="/sell/kindManage">品种管理</a></li>
        <li class="layui-nav-item"><a href="/sell/logout">退出</a></li>
    </ul>
</div>
<div>
    <div style="width: 1200px;margin-left: 50px;margin-top: 20px">
        <div style="display: inline-block;width: 200px;height: 50px">
            <input type="text" placeholder="输入第一级菜单名字" class="layui-input" id="firstName"></div>
        <div style="display: inline-block;width: 100px;height: 50px;margin-left: 50px">
            <button class="layui-btn" id="first">添加一级菜单</button>
        </div>
    </div>

    <div style="width: 1200px;margin-left: 50px">
        <div style="display: inline-block;width: 200px;height: 50px;margin-right: 50px;">
            <select name="" id="systemId" class="layui-input">
                {{range  .SystemType}}
                    {{range  .SubMenu}}
                        {{if ne .SystemMenuId 0}}
                            <option value="{{.SystemMenuId}}">{{.SystemMenuName}}</option>
                        {{end}}
                    {{end}}
                {{end}}
            </select>
        </div>
        <div style="display: inline-block;width: 200px;height: 50px;margin-right: 50px;">
            <select name="" id="parendId" class="layui-input">
                {{range  .GoodKinds}}
                    {{if eq .GoodsKindParent 0 }}
                        <option value="{{.GoodsKindId}}">{{.GoodsKindName}}</option>
                    {{end}}
                {{end}}
            </select>
        </div>
        <div style="display: inline-block;width: 200px;height: 50px">
            <input type="text" placeholder="输入第二级菜单名字" class="layui-input" id="secondName"></div>
        <div style="display: inline-block;width: 100px;height: 50px;margin-left: 50px">
            <button class="layui-btn" id="secondAdd">添加二级菜单</button>
        </div>
    </div>

</div>


</div>
<div>
    <table class="layui-hide" id="test" lay-filter="test"></table>
</div>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    layui.use(['table', 'laytpl', 'jquery',
    ], function () {
        var table = layui.table;
        var laytpl = layui.laytpl;
        var $ = layui.jquery
        var form = layui.form;
        // laytpl.config({
        //     open: '<%',
        //     close: '%>'
        // });
        table.render({
            elem: '#test'
            , url: '/sell/getKinds'
            , title: '用户数据表'
            , height: 500
            , page: true
            , toolbar: "#toolbarDemo"
            , cols: [[

                {type: 'checkbox', fixed: 'left'}
                , {field: 'GoodsKindId', title: '编号', width: 80, fixed: 'left', unresize: true, sort: true}
                , {field: 'GoodsKindName', title: '名字', width: 120, edit: 'text'}
                , {field: 'SystemKindId', title: '系统分类Id', width: 80, edit: 'text', sort: true}
                , {field: 'GoodsKindParent', title: '父菜单编号', width: 100, edit: 'text'}
                , {
                    field: "isFather", title: '是否为子菜单', width: 100, templet: function (res) {
                        if (res.GoodsKindParent != 0) {
                            return '<p>是</p>'
                        } else {
                            return '<p>否</p>'
                        }
                    }
                }
                , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 150}
            ]]
        });


        //监听行工具事件

        $("#first").on('click', function () {
            var name = $("#firstName").val()
            var data1 = "parentName=" + name;

            $.ajax({
                url: "/sell/addFaterKind",
                type: "post",
                data: data1,
                dataType: 'json',
                contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                success: function (res) {
                    console.log(res);
                    if (res.code == 0) {
                        layer.alert("添加成功")
                    } else {
                        layer.alert("操作失败")
                    }
                }
            })
        })
        $("#secondAdd").on('click',function () {
            var name = $("#secondName").val()
            var systemId = $("#systemId option:selected").val()
            var parentId = $("#parendId option:selected").val()

            var data1 = "secondName=" + name +'&' + 'systemId='+systemId +'&'+'parentId='+parentId;
            $.ajax({
                url: "/sell/addSecondKind",
                type: "post",
                data: data1,
                dataType: 'json',
                contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                success: function (res) {
                    console.log(res);
                    if (res.code == 0) {
                        layer.alert("添加成功")
                    } else {
                        layer.alert("操作失败")
                    }
                }
            })
        })
        table.on('tool(test)', function (obj) {
            var data = obj.data;
            //console.log(obj)
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                    obj.del();
                    delKind(data)
                    layer.close(index);
                });
            }
        });


        function delKind(data) {
            var data1 = "kindId=" + data.GoodsKindId
            $.ajax({
                url: "/sell/deleteKind",
                type: "post",
                data: data1,
                dataType: 'json',
                contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                success: function (res) {
                    if (res.code == 0) {
                        layer.alert("删除成功")
                    } else {
                        layer.alert("删除失败")
                    }
                }
            })
        }

    });
</script>

</body>
</html>